<template>
	<view>
		<view style="padding-bottom: 132upx;">
			<view v-for="(item,index) in res" :key="index">
				<view class="webkit" style="padding: 20upx;background: #fff;">
					<image :src="item.thumb" style="width: 166upx;height: 166upx;margin-right: 20upx;"></image>
					<view class="flex">
						<text style="line-height: 36upx;height: 72upx;display: block;" v-cloak>{{item.title}}</text>
						<view class="webkit" style="font-size: 26upx;color: #999;line-height: 40upx;"><text class="flex" v-cloak>{{item.optiontitle}}</text><text v-cloak>x{{item.total}}</text></view>
						<text style="color: #f55;display: block;font-size: 30upx;" v-cloak>¥{{item.price}}</text>
					</view>
				</view>
				<view style="background: #f5f5f5;padding-bottom: 40upx;">
					<view class="webkit" style="padding: 20upx;" >
						<text>评分：</text>
						<uni-rate size="22" value="0" color="#999" active-color="#FF5555" is-fill="true" @change='change($event,item.goodsid)' margin="5" style="margin-top: 20upx"></uni-rate>
					</view>
					<view style="padding: 0 20upx;">
						<textarea @blur="blur($event,item.goodsid)" value="" placeholder="说点什么吧" style="background: #fff;width: 100%;padding: 20upx;font-size: 26upx;box-sizing: border-box;height: 180upx;"/>
					</view>
				</view>
			</view>
		</view>
		<view style="position: fixed;bottom: 0;width: 100%;padding: 20upx;box-sizing: border-box;background: #f9f9f9;">
			<button type="primary" style="width: 100%;background: #f55;" @click="submit()">提交评价</button>
		</view>
	</view>
</template>

<script>
	import uniRate from "../../../components/uni-rate/uni-rate.vue"
	export default {
		components: {uniRate},
		data() {
			return {
				res:[],
				orderid:0.,
				subdata:[],
				openid:''
			};
		},
		onLoad:function(e){
			this.orderid = e.id
			uni.showLoading()
			uni.getStorage({
				key: 'openid',
				success: (res) => {
					this.openid = res.data
					this.setAjax()
				},
				fail: () => {
					uni.navigateTo({
						url: '../../login/login'
					});
				}
			});
		},methods:{
			setAjax(){
				uni.request({
					url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=order.comment&app=1',
					method: 'POST',
					data: {'openid':this.openid,'id':this.orderid},
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						console.log(res)
						uni.hideLoading()
						this.res = res.data
						for(var i=0;i<this.res.length;i++){
							var ary = [];
							ary.goodsid = this.res[i].goodsid
							this.subdata.push(ary)
						}
					},
					fail: () => {},
					complete: () => {}
				});
			},
			change(level,id){
				for(var i in this.subdata){
					if(this.subdata[i].goodsid == id){
						this.subdata[i].level = level.value
					}
				}
			},
			blur(value,id){
				for(var i in this.subdata){
					if(this.subdata[i].goodsid == id){
						this.subdata[i].content = value.detail.value
					}
				}
			},
			submit(){
				for(var i = 0 ;i < this.res.length;i++){
					var level = this.subdata[i].level
					var content = this.subdata[i].content
					if(level == undefined){
						uni.showToast({
							title:'还没有评分',
							icon:"none"
						})
						
					}else if(content == undefined){
						uni.showToast({
							title:'说点什么吧',
							icon:"none"
						})
					}else{
						var d1 = '{"openid":"'+this.openid+'","orderid":"'+this.orderid+'","comments['+i+'][goodsid]":"'+this.subdata[i].goodsid+'","comments['+i+'][level]":"'+level+'","comments['+i+'][content]":"'+content+'"'
					}
				}
				d1 = d1 + '}'
				var data =typeof d1=='string'?JSON.parse(d1):d1;
				// var data = JSON.parse(d1);
				console.log(data)
				uni.request({
					url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=order.comment.submit&app=1',
					method: 'POST',
					data: data,
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						if(res.data.status == 1){
							uni.showToast({
								title:'评论成功',
								icon:"none"
							})
							setTimeout(() => {
								 uni.navigateBack();
							}, 1500);
						}
					},
					fail: () => {},
					complete: () => {}
				});
			}
		}
	}
</script>

